<template>
    <div class="pad20">
        <div class="filter-container">
            <!--查询的表单数据-->
            <el-form :inline="true" :model="map" size="mini">
                <el-form-item label="审核时间:">
                    <el-date-picker
                            v-model="map.selectDate"
                            type="datetimerange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            value-format="yyyyMMddHHmmss">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="审核状态:">
                    <el-select v-model="map.state" class="auto-width" clearable filterable placeholder="状态" style="width: 85px">
                        <el-option
                                v-for="item in opts.isPutawayList"
                                :key="item.code"
                                :label="item.desc"
                                :value="item.code">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button icon='el-icon-search' type="primary" @click="handleCheck">查询</el-button>
                    <el-button icon='el-icon-refresh' class="filter-item" @click="handleReset">重置</el-button>
                </el-form-item>
            </el-form>
        </div>
        <!--详情的弹出框-->
        <el-dialog
                title="详情"
                :visible.sync="visible"
                width="30%">
            <el-form :inline="true" :model="infoList" disabled="true" >
                <el-form-item label="审核信息:">
                    <el-input style: v-model.trim="infoList.content"></el-input>
                </el-form-item>
            </el-form>
        </el-dialog>
        <!--数据表格-->
        <el-table  size="medium" :data="list" stripe border>
            <el-table-column type="index" label="序号" width="100" align="center">
            </el-table-column>
            <el-table-column label="用户编号" align="center" prop="userid">
            </el-table-column>
            <el-table-column prop="username" label="用户昵称" align="center">
            </el-table-column>
            <el-table-column prop="gmtCreate" label="申请时间" align="center">
            </el-table-column>
            <el-table-column prop="empname" label="审核人" align="center">
            </el-table-column>
            <el-table-column prop="gmtModified" label="审核时间" align="center">
            </el-table-column>
            <el-table-column
                    label="审核状态"
                    prop="state"
                    width="80"
                    align="center">
                <template slot-scope="scope">
                    <el-tag type="success" v-if="scope.row.state === 1">通过</el-tag>
                    <el-tag type="danger" v-if="scope.row.state === 2">不通过</el-tag>
                    <el-tag type="warning" v-if="scope.row.state === 0">未审核</el-tag>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="100">
                <template slot-scope="scope">
                    <el-button  type="success" @click="handleEdit(scope.row)" size="mini">详情</el-button>
                </template>
            </el-table-column>
        </el-table>
        <!--分页-->
        <el-pagination
                background
                style="float: right;margin-top: 20px; margin-bottom: 22px"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :page-size="page.pageSize"
                :page-sizes="[2, 8, 10, 15, 20, 30]"
                layout="total, sizes, prev, pager, next, jumper"
                :total="page.totalCount">
        </el-pagination>

    </div>
</template>

<script>
    export default {
        name: "businesschecklist",
        data() {
            return {
                visible: false,
                map: {
                    searchStart:"",
                    searchEnd:"",
                    state:""
                },
                list: [],
                page: {
                    pageCurrent: 1,
                    pageSize: 5,
                    totalCount: 0,
                    totalPage: 0
                },
                srcList: [''],
                infoList: {},
                opts: {
                    isPutawayList: [{
                        code: 1,
                        desc:"通过"
                    },{
                        code: 2,
                        desc:"不通过"
                    }]
                },
            }
        },
        created() {
            this.searchBusiness()
        },
        methods: {
            // 商家分类分页列表接口
            searchBusiness(){
                if(this.map.selectDate != null){
                    if(this.map.selectDate.length > 0){
                        this.map.searchStart = this.map.selectDate[0];
                        this.map.searchEnd = this.map.selectDate[1];
                    }
                }else{
                    this.map.searchStart = '';
                    this.map.searchEnd = '';
                }
                var that =this
                // this.map.pageCurrent = this.page.pageCurrent;
                // this.map.pageSize = this.page.pageSize;
                this.$http.post("/business/checkBusiness/findAll?currentPage="+this.page.pageCurrent+"&pageSize="+this.page.pageSize,this.map).then(function (resp) {
                    if (resp.data.code===200){
                        that.list = resp.data.data.list
                        that.page.totalCount = resp.data.data.total
                    }
                })
            },
            //查询
            handleCheck() {
                this.searchBusiness();
            },
            // 重置查询条件
            handleReset() {
                this.reload()
            },
            // 刷新当前页面
            reload() {
                this.map = {}
                this.searchBusiness()
            },
            handleSizeChange(val) {
                this.page.pageSize = val
                this.searchBusiness()
            },
            handleCurrentChange(val) {
                this.page.pageCurrent = val
                this.searchBusiness()
            },
            // 详情弹窗
            handleEdit(row) {
                this.infoList = row;
                console.log("11111111111111111111")
                console.log(row)
                console.log(this.infoList)
                this.visible = true
            },

            //往imglist里添加url
            setimglist(url){
                this.srcList[0]=url;
            }
        }
    }
</script>

<style scoped>

</style>
